<template>
  <div class="app-detail">
    <el-card class="box-card">
      <div class="container-header">
        <div class="hign-line"></div>
        <div class="header-left">
          {{ $t("inventoryManagement.baseInfo") }}
        </div>
      </div>
      <el-form
        :model="viewModel"
        ref="templateForm"
        label-width="88px"
        :rules="rules"
      >
        <el-row :gutter="24" class="mb8">
          <!-- 数据源 移除 隐藏默认为来料 -->
          <!-- <el-form-item :label="$t('inspectionManagement.dataSource')" prop="dataSource">
              <el-radio-group v-model="viewModel.dataSource">
                  <el-radio label="1">{{$t('inspectionManagement.incoming')}}</el-radio>
                  <el-radio label="2">{{$t('inspectionManagement.inventory')}}</el-radio>
              </el-radio-group>
          </el-form-item> -->
          <el-col :span="24">
            <el-form-item
              :label="$t('inspectionManagement.templateName')"
              prop="templateName"
            >
              <el-input
                :disabled="isView"
                v-model="viewModel.templateName"
                :placeholder="
                  $t('public.placeholder', {
                    placeholder: $t('inspectionManagement.templateName'),
                  })
                "
                clearable
                size="small"
                @keyup.enter.native="handleQuery"
              />
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <!-- 事业部  -->
            <el-form-item
              :label="'所属' + $t('inspectionStandards.division')"
              prop="divisionName"
            >
              <division-dialog
                v-model="viewModel.divisionName"
                @callback="divisionNameSelected"
              />
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <!-- 批量更新  -->
            <el-form-item v-if="data.length>0" :label="$t('inspectionStandards.batchUpdates')">
              <el-row gutter="20">
                <el-col :span="6">
                  <el-input v-model="treeSearch"></el-input>
                </el-col>
                <el-col :span="6">
                  <el-button
                    type="primary"
                    size="small"
                    :loading="bindLoading"
                    @click="treeSearchBind"
                    :disabled="treeSearch==''"
                  >
                    {{ $t("public.bind") }}
                  </el-button>
                  <el-button
                    size="small"
                    class="drawer-close"
                    @click="trueSearchUnBind"
                    :disabled="treeSearch==''"
                    >{{ $t("public.cancel") }}
                  </el-button>
                </el-col>
              </el-row>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item
              :label="
                $t('formValidation.materialClassification') +
                '-' +
                $t('formValidation.affiliatedFactoryArea')
              "
              prop="description"
              style="width: 100%"
            >
              <el-tree
                :data="data"
                ref="tree"
                node-key="id"
                :expand-on-click-node="false"
                :default-expanded-keys="treeDefaultCheckedKeys"
                :default-checked-keys="treeDefaultCheckedKeys"
                :show-checkbox="true"
                :check-strictly="true"
                @check="check"
                :filter-node-method="filterNode"
                v-loading="treeLoading"
              >
                <span class="custom-tree-node" slot-scope="{ node, data }">
                  <i
                    class="el-icon-folder"
                    style="color: #dfba49; margin-right: 5px"
                  ></i>
                  <span>{{ node.label }}</span>
                </span>
              </el-tree>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <div
              style="
                width: 16px;
                height: 16px;
                background-color: #eef2fb;
                border-radius: 2px;
              "
            ></div>
            <div style="margin-top: -20px; margin-left: 20px">
              已被其他模板绑定
            </div>
            <div class="container-table">
              <el-table
                class="table-fixed"
                ref="multipleTable"
                border
                v-loading="loading"
                :data="tableData"
                height="calc(60vh - 200px)"
                @selection-change="handleSelectionChange"
                @select="selected"
              >
                <el-table-column
                  type="selection"
                  width="55"
                  fixed="left"
                  align="center"
                  :show-overflow-tooltip="true"
                  :selectable="selectable"
                />
                <el-table-column
                  align="left"
                  prop="plantName"
                  min-width="180"
                  :show-overflow-tooltip="true"
                />
              </el-table>
            </div>
          </el-col>
          <el-col :span="24">
            <el-form-item
              :label="$t('inventoryManagement.description')"
              prop="description"
              style="width: 100%"
            >
              <el-input
                type="textarea"
                :disabled="isView"
                :autosize="{ minRows: 5, maxRows: 6 }"
                v-model="viewModel.description"
                maxlength="1000"
              >
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </el-card>
    <inspection-item-info
      ref="inspectSubmit"
      :itemData="inpectItemData"
      @callback="submitCallback"
    ></inspection-item-info>
    <div class="submit-footer">
      <el-button
        icon="el-icon-close"
        size="small"
        @click="closeTab"
        class="drawer-close"
        >{{ $t("public.close") }}
      </el-button>
      <el-button
        type="primary"
        v-if="!isView"
        @click="submitAddForm"
        icon="el-icon-check"
        size="small"
      >
        {{ $t("public.submit") }}
      </el-button>
    </div>
  </div>
</template>

<script>
import {
  listType,
  getType,
  delType,
  addType,
  updateType,
  refreshCache,
} from "@/api/basic/dict/type";
import { listProject } from "@/api/basic/project";
import { getNoticeList, deleteNotice, readNotice } from "@/api/system/message";
import { listCheckoutUnit } from "@/api/basic/checkoutUnit";
import FileUploadInput from "@/components/FileUploadInput";
import MeasuringToolDialog from "@/views/components/MeasuringToolDialog";
import {
  addTemplate,
  editTemplate,
  getTemplateById,
  findRelFactory,
  getTemplateInfoByVersion,
} from "@/api/inspectionManagement/inspectionManagement";
import inspectionItemInfo from "@/views/components/InspectionItemInfo";
import { getTree } from "@/api/basic/materialClassification";
import { listFactory } from "@/api/basic/factory";
import DivisionDialog from "@/views/components/DivisionDialog";
import { getTreeByDivisionNameAPI } from "../../../../api/basic/materialClassification";

export default {
  name: "addTemplate",
  dicts: ["sys_normal_disable"],
  components: {
    FileUploadInput,
    MeasuringToolDialog,
    inspectionItemInfo,
    DivisionDialog,
  },
  data() {
    const data = [];
    return {
      direction: "rtl",
      addInspectionExemption: false,
      unitList: [],
      drawer: false,
      approvalOpen: false,
      viewInspectionExemption: false,
      inspectionItemsTypeOptions: [
        {
          value: "1",
          label: "外观",
        },
        {
          value: "2",
          label: "尺寸/物性",
        },
        {
          value: "3",
          label: "性能",
        },
      ],
      frequencyOptions: [
        {
          value: "批",
          label: "批",
        },
        {
          value: "件",
          label: "件",
        },
        {
          value: "年",
          label: "年",
        },
        {
          value: "季",
          label: "季",
        },
        {
          value: "月",
          label: "月",
        },
        {
          value: "日",
          label: "日",
        },
      ],
      samplingSchemeOptions: [
        {
          value: "GB/T2828.1-2012",
          label: "GB/T2828.1-2012",
        },
        {
          value: "百分比",
          label: "百分比",
        },
        {
          value: "固定抽样",
          label: "固定抽样",
        },
        {
          value: "C=0",
          label: "C=0",
        },
      ],
      testMethodOptions: [
        {
          value: "目测",
          label: "目测",
        },
        {
          value: "量具",
          label: "量具",
        },
        {
          value: "验证",
          label: "验证",
        },
        {
          value: "ny-iqc作业指导书",
          label: "ny-iqc作业指导书",
        },
        {
          value: "核对COA",
          label: "核对COA",
        },
      ],
      samplingLevelOptions: [
        {
          value: "S-1",
          label: "S-1",
        },
        {
          value: "S-2",
          label: "S-2",
        },
        {
          value: "S-3",
          label: "S-3",
        },
        {
          value: "S-4",
          label: "S-4",
        },
        {
          value: "Ⅰ",
          label: "Ⅰ",
        },
        {
          value: "Ⅱ",
          label: "Ⅱ",
        },
        {
          value: "Ⅲ",
          label: "Ⅲ",
        },
      ],
      samplingMethodCOptions: [
        {
          value: "0.01",
          label: "0.01",
        },
        {
          value: "0.015",
          label: "0.015",
        },
        {
          value: "0.025",
          label: "0.025",
        },
        {
          value: "0.04",
          label: "0.04",
        },
        {
          value: "0.1",
          label: "0.1",
        },
        {
          value: "0.15",
          label: "0.15",
        },
        {
          value: "0.25",
          label: "0.25",
        },
        {
          value: "0.4",
          label: "0.4",
        },
        {
          value: "0.65",
          label: "0.65",
        },
        {
          value: "1",
          label: "1",
        },
        {
          value: "1.5",
          label: "1.5",
        },
        {
          value: "4",
          label: "4",
        },
        {
          value: "6.5",
          label: "6.5",
        },
        {
          value: "10",
          label: "10",
        },
      ],
      samplingLevelTypeOptions: [
        {
          value: "正常",
          label: "正常",
        },
        {
          value: "放宽",
          label: "放宽",
        },
        {
          value: "加严",
          label: "加严",
        },
      ],
      samplingFixedTypeOptions: [
        {
          value: "批",
          label: "批",
        },
        {
          value: "件",
          label: "件",
        },
      ],
      specialCharacteristicsOptions: [
        {
          value: "空",
          label: "空",
        },
        {
          value: "CC",
          label: "CC",
        },
        {
          value: "SC",
          label: "SC",
        },
      ],
      addModel: {},
      viewModel: {},
      editModel: {},
      approvalForm: {
        status: "1",
        textarea: "",
      },
      selBtn: 1,
      // 遮罩层
      loading: false,
      treeLoading: false,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 字典表格数据
      typeList: [
        {
          samplingOne: null,
          samplingTwo: null,
          samplingThree: null,
          measuringTool: null,
          inspectionType: "1",
          specialCharacteristics: "0",
          projectCode: null,
        },
      ],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 日期范围
      dateRange: [],
      projectList: [],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        noticeTitle: undefined,
        noticeType: undefined,
        hasRead: undefined,
        createTime: undefined,
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        templateName: [
          {
            required: true,
            message: this.$t("formValidation.templateNameCannotBeEmpty"), //'模板名称不能为空'
            trigger: "blur",
          },
        ],
        dataSource: [
          {
            required: true,
            message: "数据源不能为空",
            trigger: "blur",
          },
        ],
        divisionName: [
          {
            required: true,
            message: "所属事业部不能为空",
            trigger: "change",
          },
        ],
      },
      fullscreen: false,
      isView: this.$route.query.isView ? true : false,
      groupId: this.$route.query.groupId,
      version: this.$route.query.version,
      id: this.$route.params.id,
      inpectItemData: [],
      data: JSON.parse(JSON.stringify(data)),
      tableData: [],
      treeDefaultCheckedKeys: [],
      relList: [],
      currentClickTreeId: "",
      currentClickChildIdsTreeId: [],
      //树搜索
      treeSearch: "",
      bindLoading: false,
    };
  },
  created() {
    // this.getList()
    // this.getProjectList()
    this.getUnitList();
    // this.getTreeList()
    if (this.id != "0") {
      if (this.id != "undefined") {
        this.getTemplateById();
      } else {
        this.getTemplateInfoByVersion();
      }
    } else {
      this.inpectItemData = [];
    }
  },
  watch: {
    treeSearch(val) {
      this.$refs.tree.filter(val);
    },
  },
  methods: {
    divisionNameSelected() {
      //清空校验
      this.$refs.templateForm.clearValidate("divisionName");
      // this.getTreeList()
      this.getTreeByDivisionName();
    },
    selected(selection, row) {
      const plantCode = selection.map((item) => item.plantCode);
      this.relList.forEach((item) => {
        if (item.businessCode == this.currentClickTreeId) {
          item.factoryCodeList = plantCode;
        }
      });
      //如果选中的物料分类下面有子节点，也要绑定
      if (this.currentClickChildIdsTreeId.length > 0) {
        this.currentClickChildIdsTreeId.forEach((id) => {
          this.relList.forEach((item) => {
            if (item.businessCode == id) {
              item.factoryCodeList = plantCode;
            }
          });
        });
      }
    },
    selectable(row, index) {
      return !row.isOtherFacBind; // 0 允许选中，1 禁用选择
    },
    check(data, node) {
      let currentNode = this.$refs.tree.getNode(data.id);
      let Ids = this.collectChildIds(currentNode);
      //记录当前点击的节点的id
      this.currentClickTreeId = data.id;
      //记录当前点击的节点的子节点的ids
      this.currentClickChildIdsTreeId = Ids;
      if (currentNode.checked) {
        this.$refs.tree.setChecked(this.currentClickTreeId, true);
        this.currentClickChildIdsTreeId.forEach((id) => {
          this.$refs.tree.setChecked(id, true);
        });
        var currentClickItem = {
          businessCode: this.currentClickTreeId,
          factoryCodeList: [],
        };
        const rel = this.viewModel.relList?.find(
          (item) => item.businessCode === currentClickItem.businessCode
        );
        const clickIdIndex = this.relList.findIndex(
          (item) => item.businessCode === currentClickItem.businessCode
        );
        if (clickIdIndex === -1) {
          this.relList.push(currentClickItem);
        }
        this.currentClickChildIdsTreeId.forEach((id) => {
          const childIdIndex = this.relList.findIndex(
            (item) => item.businessCode === id
          );
          if (childIdIndex === -1) {
            var newChildIdItem = { businessCode: id, factoryCodeList: [] };
            this.relList.push(newChildIdItem);
          }
        });
        this.loading = true;
        listFactory().then((res2) => {
          findRelFactory({
            relDataId: data.id,
            templateGroupId: rel?.templateGroupId,
          }).then((res1) => {
            if (
              res1.data.factoryCodeList != null &&
              res1.data.factoryCodeList.length > 0
            ) {
              res1.data.factoryCodeList.forEach((item1) => {
                res2.rows.forEach((item2) => {
                  if (item1 == item2.plantCode) {
                    item2.defaultChecked = true;
                  }
                });
              });
            }
            // 去除已被其他模板绑定限制
            // if (res1.data.otherFactoryCodeList != null && res1.data.otherFactoryCodeList.length > 0) {
            //   res1.data.otherFactoryCodeList.forEach(item1 => {
            //     res2.rows.forEach(item2 => {
            //       if (item1 == item2.plantCode) {
            //         item2.isOtherFacBind = true
            //       }
            //     })
            //   })
            // }
            this.tableData = res2.rows;
            this.loading = false;
            setTimeout(() => {
              this.tableData.forEach((item3) => {
                if (item3.defaultChecked) {
                  this.$refs.multipleTable.toggleRowSelection(item3, true);
                }
                if (item3.isOtherFacBind) {
                  this.$refs.multipleTable.toggleRowSelection(item3, true);
                }
              });
            }, 300);
          });
        });
      } else {
        //取消选中，移除relList中绑定
        this.$refs.tree.setChecked(this.currentClickTreeId, false);
        const indexToRemove = this.relList.findIndex(
          (item) => item.businessCode === this.currentClickTreeId
        );
        if (indexToRemove !== -1) {
          this.relList.splice(indexToRemove, 1);
        }
        this.currentClickChildIdsTreeId.forEach((id) => {
          this.$refs.tree.setChecked(id, false);
          const childIndexToRemove = this.relList.findIndex(
            (item) => item.businessCode === id
          );
          if (childIndexToRemove !== -1) {
            this.relList.splice(childIndexToRemove, 1);
          }
        });
        this.tableData = [];
      }
    },
    // 递归收集节点的childNodes.data.id
    collectChildIds(node) {
      const collectedIds = [];
      // 递归处理子节点
      if (node.childNodes && node.childNodes.length > 0) {
        for (const childNode of node.childNodes) {
          // 如果子节点有data属性，并且有id属性，收集它的id
          if (childNode.data && childNode.data.id) {
            collectedIds.push(childNode.data.id);
          }

          // 递归处理子节点的子节点
          collectedIds.push(...this.collectChildIds(childNode));
        }
      }
      return collectedIds;
    },
    getTreeList() {
      this.treeLoading = true;
      getTree().then((response) => {
        this.data = response.data;
        this.treeLoading = false;
      });
    },
    getTreeByDivisionName() {
      this.treeLoading = true;
      getTreeByDivisionNameAPI(this.viewModel.divisionName).then((response) => {
        this.data = response.data;
        this.treeLoading = false;
      });
    },
    changeSampling(e, scope) {
      console.log(scope.$index);
      this.typeList[scope.$index].samplingTwo = null;
      this.typeList[scope.$index].samplingThree = null;
    },
    getTemplateById() {
      getTemplateById({ templateName: this.id }).then((res) => {
        this.viewModel = res.data;
        this.treeDefaultCheckedKeys = this.viewModel.relList.map(
          (item) => item.businessCode
        );
        this.inpectItemData = res.data.itemList;
        //todo 为了防止编辑进来之前的绑定的厂区没了
        this.viewModel.relList.forEach((item) => {
          let relDataId = item.businessCode;
          let templateGroupId = item.templateGroupId;
          findRelFactory({
            relDataId: relDataId,
            templateGroupId: templateGroupId,
          }).then((res) => {
            if (res.code == 200) {
              this.relList.push({
                businessCode: relDataId,
                factoryCodeList: res.data.factoryCodeList,
              });
            }
          })
        })
        if (!this.isView) {
          this.viewModel.divisionName = this.$route.query.divisionName;
        }
        this.getTreeByDivisionName()
      })
    },
    getTemplateInfoByVersion() {
      getTemplateInfoByVersion({
        groupId: this.groupId,
        version: this.version,
      }).then((res) => {
        this.viewModel = res.data;
        this.treeDefaultCheckedKeys = this.viewModel.relList.map(
          (item) => item.businessCode
        );
        this.inpectItemData = res.data.itemList;
      });
    },
    getUnitList() {
      listCheckoutUnit().then((res) => {
        this.unitList = res.rows;
      });
    },
    getProjectList() {
      listProject().then((res) => {
        this.projectList = res.rows;
      });
    },
    changeProject(e) {
      let obj = this.projectList.find((item) => {
        return item.projectName === e.row.projectName;
      });
      this.typeList[e.$index].projectCode = obj.projectCode;
      this.typeList[e.$index].projectId = obj.projectId;
    },
    closeTab() {
      this.$router.go(-1);
    },
    effectDateChange(e, scope) {
      if (parseInt(e) > 0) {
        this.typeList[scope.$index].endDate = this.getNewDay(
          scope.row.approvalTime,
          e
        );
      }
    },
    getNewDay(dateTemp, days) {
      var dateTemp = dateTemp.split("-");
      //转换为MM-DD-YYYY格式
      var nDate = new Date(dateTemp[1] + "-" + dateTemp[2] + "-" + dateTemp[0]);
      var millSeconds = Math.abs(nDate) + days * 24 * 60 * 60 * 1000;
      var rDate = new Date(millSeconds);
      var year = rDate.getFullYear();
      var month = rDate.getMonth() + 1;
      if (month < 10) month = "0" + month;
      var date = rDate.getDate();
      if (date < 10) date = "0" + date;
      return year + "-" + month + "-" + date;
    },
    fileChange(e) {
      console.log(e);
    },
    filterNode(value, data) {
      if (!value) return true;
      this.tableData = [];
      return data.label === value;
    },
    async treeSearchBind() {
      const treeSearch = this.treeSearch;
      if (treeSearch == "") {
        return;
      }
      if (!this.$refs.tree) {
        return;
      }
      
      this.bindLoading = true;
      const currentKey = this.$refs.tree.getCheckedKeys();
      const _data = [];
      const relList = this.relList;
      let plantCodes = [];
      const filter = (data) => {
        data.forEach((item) => {
          console.log(item.label);
          if (item.label === treeSearch) {
            _data.push(item.id);
          }
          if (item.children) {
            filter(item.children);
          }
        });
      };
      filter(this.data);
      this.$refs.tree.setCheckedKeys([...currentKey, ..._data]);
      const res = await listFactory();
      if (res.code == 200) {
        plantCodes = (res.rows || []).map((item) => item.plantCode);
      }
      _data.forEach((item) => {
        const index = relList.findIndex((item1) => item1.businessCode == item);
        if (index == -1) {
          relList.push({
            businessCode: item,
            factoryCodeList: plantCodes,
          });
        } else {
          relList[index].factoryCodeList = plantCodes;
        }
      });
      this.bindLoading = false;
      console.log(_data);
    },
    // 取消绑定
    trueSearchUnBind() {
      const treeSearch = this.treeSearch;
      if (treeSearch == "") {
        return;
      }
      if (!this.$refs.tree) {
        return;
      }
      const _data = [];
      const relList = this.relList;
      const filter = (data) => {
        data.forEach((item) => {
          console.log(item.label);
          if (item.label === treeSearch) {
            _data.push(item.id);
          }
          if (item.children) {
            filter(item.children);
          }
        });
      };
      filter(this.data);
      _data.forEach((item) => {
        this.$refs.tree.setChecked(item, false);
        const index = relList.findIndex((item1) => item1.businessCode == item);
        index >= 0 && relList.splice(index, 1);
      });
    },
    drawerClose() {
      this.drawer = false;
    },
    /** 查询字典类型列表 */
    getList() {
      this.loading = true;
      getNoticeList(this.queryParams).then((response) => {
        if (response.code == 200 && response.rows) {
          //   this.typeList = response.rows;
          this.total = response.total;
          this.loading = false;
        }
      });
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        dictId: undefined,
        dictName: undefined,
        dictType: undefined,
        status: "0",
        remark: undefined,
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.dateRange = [];
      this.resetForm("queryForm");
      this.handleQuery();
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.typeList.push({
        samplingOne: null,
        samplingTwo: null,
        samplingThree: null,
        measuringTool: null,
        inspectionType: "1",
        specialCharacteristics: "0",
        projectCode: null,
      });
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      const plantCode = selection.map((item) => item.plantCode);
      this.relList.forEach((item) => {
        if (item.businessCode == this.currentClickTreeId) {
          item.factoryCodeList = plantCode;
        }
      });
      //如果选中的物料分类下面有子节点，也要绑定
      if (this.currentClickChildIdsTreeId.length > 0) {
        this.currentClickChildIdsTreeId.forEach((id) => {
          this.relList.forEach((item) => {
            if (item.businessCode == id) {
              item.factoryCodeList = plantCode;
            }
          });
        });
      }
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const dictId = row.dictId || this.ids;
      getType(dictId).then((response) => {
        this.form = response.data;
        this.open = true;
        this.title = "修改字典类型";
      });
    },
    /** 提交按钮 */
    submitForm: function () {
      let isTrue = false;
      this.$refs["templateForm"].validate((valid) => {
        if (valid) {
          isTrue = true;
        } else {
          this.$modal.msgError(
            this.$t("formValidation.theBasicInformationIsIncomplete")
          );
          isTrue = false;
        }
      });
      return isTrue;
    },

    /** 发起检验提交 */
    submitAddForm: function () {
      if (this.submitForm()) {
        this.$refs.inspectSubmit.submitAddForm();
      }
    },

    /** 删除按钮操作 */
    handleDelete(row) {
      if (this.typeList.length === 1) {
        this.$modal.msgWarning("请至少保留一条检验项!");
        return;
      }
      this.typeList.splice(row.$index, 1);
    },
    /** 查看按钮操作 */
    handleView(row) {
      this.form = row;
      this.viewInspectionExemption = true;
    },
    submitCallback(params) {
      console.log("提交后端传递的this.relList");
      console.log(this.relList);
      let submitData = {
        ...this.viewModel,
        itemList: params,
        relList: this.relList,
      };
      let action = this.id == "0" ? addTemplate : editTemplate;
      submitData["dataSource"] = 1; // dataSource 数据源  固定为 1
      action(submitData).then((res) => {
        this.loading = false;
        if (res.code == 200) {
          this.$modal.msgSuccess("操作成功!");
          this.$router.go(-1);
        } else {
          this.$modal.msgError(res.msg);
        }
      });
    },
  },
};
</script>
<style lang="scss" scoped>
::v-deep .el-card {
  padding-top: 20px;
  border: 0px;
  box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.08);
  border-radius: 4px;
  padding-bottom: 20px;
}

::v-deep .el-aside {
  padding: 0;
  margin-bottom: 0;
}

.content-style {
  border: 0px;
  box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.08);
  border-radius: 2px;
  background-color: white;
  margin-top: 10px;
}

::v-deep .el-button-group .selBtn {
  background: #fff;
  border: 1px solid #0b7be3;
  color: #0b7be3;
}

::v-deep .el-button-group .unselBtn {
  background: #fff;
  border: 1px solid #ededf2;
  color: #666666;
}

.header-left {
  float: left;
  font-size: 14px;
  font-family: PingFangSC-Semibold, PingFang SC;
  font-weight: 600;
  color: #333333;
  line-height: 40px;
  display: flex;
  justify-content: center;
}

.header-right {
  float: right;
}

.container-header {
  float: left;
  width: 100%;
  border-bottom: 1px solid #ededf2;
  padding-left: 12px;
}

.container-table {
  float: left;
  margin-top: 6px;
  width: 100%;
  //   max-height: calc(100vh - 600px);
  overflow: auto;
}

.mb8 {
  float: left;
  margin-top: 6px;
  width: 100%;
}

.drawer-footer {
  display: flex;
  position: relative;
  z-index: 9999;
  bottom: -40px;
  height: 40px;
  justify-content: center;
  width: 100%;
}

.hign-line {
  position: relative;
  left: -8px;
  top: 14px;
  height: 12px;
  border-radius: 2px;
  border: 1px solid #0b7be3;
  float: left;
}

.drawer-close {
  background: #f7f8fa;
  border-color: #f7f8fa;
}

.submit-footer {
  height: 52px;
  background: #ffffff;
  box-shadow: 0px -5px 5px 0px rgba(0, 0, 0, 0.08);
  border-radius: 4px 4px 0px 0px;
  position: fixed;
  z-index: 9;
  bottom: 0px;
  width: 100%;
  left: 0px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.samplingPercent {
  position: absolute;
  z-index: 9;
  right: 20px;
}

::v-deep .el-card {
  padding-top: 0px;
}

.app-detail {
  max-height: calc(100vh - 180px);
  overflow: auto;
}
</style>
